<!--
 * @Description: 操作弹窗提示框组件
 * @version: 电子名片2.0
 * @Author: 尹鑫
 * @Date: 2020-12-02 09:31:16
 * @LastEditors: 尹鑫
 * @LastEditTime: 2020-12-16 10:35:56
 * @传值说明
    props:{
      title: 顶部标题， 默认为 '提示'
      content: 自定义文本内容， 默认为 '请输入自定义内容！'
      confirmText: 确认按钮文本， 默认为 '确认'
      cancelText: 取消按钮文本， 默认为 '取消'
      type: 消息类型，用于显示图标 默认为空 支持 'success / info / warning / error' 图标
    }
    events:{
      open() ：打开模态框方法 // 自定义 ref 调用 接收参数传入 并在回调中传出
      confirm ：确认回调 // 使用 @ 自定义方法接收回调
      cancel : 取消回调 // 使用 @ 自定义方法接收回调
    }
-->
<template>
  <div />
</template>
<script>
export default {
  props: {
    title: {
      type: [String],
      default: '提示'
    },
    content: {
      type: [String],
      default: '请输入自定义内容！'
    },
    confirmText: {
      type: [String],
      default: '确认'
    },
    cancelText: {
      type: [String],
      default: '取消'
    },
    type: {
      type: [String],
      default: ''
    },
    confirmTipText: {
      type: [String],
      default: '操作成功!'
    },
    cancelTipText: {
      type: [String],
      default: '已取消操作'
    }
  },
  methods: {
    // 开启模态框方法
    open(value) {
      this.$confirm(this.content, this.title, {
        confirmButtonText: this.confirmText,
        cancelButtonText: this.cancelText,
        distinguishCancelAndClose: true,
        type: this.type,
        closeOnClickModal: false
      }).then(() => {
        // 发送确认回调与参数
        this.$emit('confirm', value)
      }).catch((action) => {
        // 发送取消回调与参数将动作行为发送给页面
        this.$emit('cancel', value, action)
      })
    }
  }
}
</script>
